<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>点跃在线_人力资源学习网</title>
    <script src="js/mui.min.js"></script>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <link href="css/mui.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="https://cdn.bootcss.com/ionicons/2.0.1/css/ionicons.min.css">
    <link rel="stylesheet" type="text/css" href="css/index.css"/>
    <script type="text/javascript" charset="utf-8">
      	mui.init();
    </script>
</head>
<body>
	<div class="mui-content">
	     <!-- 搜索框 -->
	    <div class="searchBor ov">
	        <input type="text" name="" placeholder="输入搜索内容" id="searchCont">
	        <i class="ion-ios-search-strong icon_Sou fRight"></i>
	    </div>
	    <!--导航-->
	    <div class="navHua ov scroll">
    	   <div class="navHuaTwo">
    	   	 <ul class="navHuaChild">
		    	<li class="lanse"><a href=""> 首页 </a></li>
		    	<li><a href="">限免课程</a></li>
		    	<li><a href="">热门推荐</a></li>
		    	<li><a href="">在线提升</a></li>
		    	<li><a href="">资格查询</a></li>
		    </ul>
    	   </div>
	    	<span class="navHuaAdd"><img src="image/add.png"/></span>
	    </div>
	    <!--轮播图-->
		<div class="lunbo">
			<ul class="content">
				<li class="zindex"><a href=""><img src="image/banner.jpg" alt=""></a></li>
				<li><a href=""><img src="image/banner.jpg" alt=""></a></li>
				<li><a href=""><img src="image/banner.jpg" alt=""></a></li>
				<li><a href=""><img src="image/banner.jpg" alt=""></a></li>
			</ul>
			<ul class="indicator">
				<li class="active"></li>
				<li></li>
				<li></li>
				<li></li>
			</ul>
		</div>
		<!--导航-->
		<ul class="navWirt ov">
			<li>
				<a href="">
					<img src="image/icon1.png"/>
					<span>精品实操课</span>
				</a>
			</li>
			<li>
				<a href="">
					<img src="image/icon2.png"/>
					<span>资格考试</span>
				</a>
			</li>
			<li>
				<a href="">
					<img src="image/icon3.png"/>
					<span>精品资料</span>
				</a>
			</li>
			<li>
				<a href="">
					<img src="image/icon4.png"/>
					<span>畅销图书</span>
				</a>
			</li>
			<li>
				<a href="">
					<img src="image/icon5.png"/>
					<span>企业赋能</span>
				</a>
			</li>
			<li>
				<a href="">
					<img src="image/icon6.png"/>
					<span>企业内训</span>
				</a>
			</li>
			<li>
				<a href="">
					<img src="image/icon7.png"/>
					<span>企业咨询</span>
				</a>
			</li>
			<li>
				<a href="">
					<img src="image/icon8.png"/>
					<span>人才顾问</span>
				</a>
			</li>
		</ul>
		<!--隔线-->
		<div class='gexian'></div>
		<!--限免试听 title-->
		<div class="freeAudition ov">
			<span class="auditonTitle"><img src="image/title1.png"/></span>
			<h2 class="auditonTitleCont"><span>限免试听</span> <a href="##">更多>></a></h2>
		</div>
		<!--视频内容-->
		<div class="videoBor">
			<ul class="auditionVideo">
				<li>
					<a href="">
						<img src="image/photo1.jpg"/>
					</a>
					<span class="auditionVideoAdree">
						专业型HR实操课
					</span>
				</li>
				<li>
					<a href="">
						<img src="image/photo1.jpg"/>
					</a>
					<span class="auditionVideoAdree">
						专业型HR实操课
					</span>
				</li>
				<li>
					<a href="">
						<img src="image/photo1.jpg"/>
					</a>
					<span class="auditionVideoAdree">
						专业型HR实操课
					</span>
				</li>
				<li>
					<a href="">
						<img src="image/photo1.jpg"/>
					</a>
					<span class="auditionVideoAdree">
						专业型HR实操课
					</span>
				</li>
				<li>
					<a href="">
						<img src="image/photo1.jpg"/>
					</a>
					<span class="auditionVideoAdree">
						专业型HR实操课
					</span>
				</li>
				<li>
					<a href="">
						<img src="image/photo1.jpg"/>
					</a>
					<span class="auditionVideoAdree">
						专业型HR实操课
					</span>
				</li>
			</ul>
		</div>
		<!--隔线-->
		<div class='gexian'></div>
		<!--精品实操课 title-->
		<div class="freeAudition ov">
			<span class="auditonTitle"><img src="image/title2.png"/></span>
			<h2 class="auditonTitleCont"><span>HR精品实操课</span> <a href="##">更多>></a></h2>
		</div>
		<!--实操课内容-->
		<ul class="shicao">
			<li>
				<a href="">
					<img src="image/photo2.jpg"/>
					<h3>HR在年终做好这六件事职业价值增倍</h3>
				</a>
				<div class="ov">
					<span><img src="image/sicon1.png"/>5800</span>
					<span><img src="image/sicon2.png"/>5800</span>
					<span><img src="image/sicon3.png"/>5800</span>
					<span class="fRight"><img src="image/sicon4.png"/>5800</span>
				</div>
			</li>
			<li>
				<a href="">
					<img src="image/photo2.jpg"/>
					<h3>HR在年终做好这六件事职业价值增倍</h3>
				</a>
				<div class="ov">
					<span><img src="image/sicon1.png"/>5800</span>
					<span><img src="image/sicon2.png"/>5800</span>
					<span><img src="image/sicon3.png"/>5800</span>
					<span class="fRight"><img src="image/sicon4.png"/>5800</span>
				</div>
			</li>
			<li>
				<a href="">
					<img src="image/photo2.jpg"/>
					<h3>HR在年终做好这六件事职业价值增倍</h3>
				</a>
				<div class="ov">
					<span><img src="image/sicon1.png"/>5800</span>
					<span><img src="image/sicon2.png"/>5800</span>
					<span><img src="image/sicon3.png"/>5800</span>
					<span class="fRight"><img src="image/sicon4.png"/>5800</span>
				</div>
			</li>
			<li>
				<a href="">
					<img src="image/photo2.jpg"/>
					<h3>HR在年终做好这六件事职业价值增倍</h3>
				</a>
				<div class="ov">
					<span><img src="image/sicon1.png"/>5800</span>
					<span><img src="image/sicon2.png"/>5800</span>
					<span><img src="image/sicon3.png"/>5800</span>
					<span class="fRight"><img src="image/sicon4.png"/>5800</span>
				</div>
			</li>
			
		</ul>
		<!--隔线-->
		<div class='gexian'></div>
		<!--人力资源考证 title-->
		<div class="freeAudition ov">
			<span class="auditonTitle"><img src="image/title3.png"/></span>
			<h2 class="auditonTitleCont"><span>人力资源考证</span> <a href="##">更多>></a></h2>
		</div>
		<!--人力资源考证内容-->
		<ul class="HRtextual">
			<li>
				<a href="">
					<img class="img" src="image/photo3.jpg"/>
					<span class="HRtextualTitle">一级管理师</span>
				</a>
				<h4>已有 <span>1000人</span>考试通过</h4>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo3.jpg"/>
					<span class="HRtextualTitle">二级管理师</span>
				</a>
				<h4>已有 <span>1000人</span>考试通过</h4>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo3.jpg"/>
					<span class="HRtextualTitle">一级管理师</span>
				</a>
				<h4>已有 <span>1000人</span>考试通过</h4>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo3.jpg"/>
					<span class="HRtextualTitle">二级管理师</span>
				</a>
				<h4>已有 <span>1000人</span>考试通过</h4>
			</li>
		</ul>
		<!--隔线-->
		<div class='gexian'></div>
		<!--精品资料 title-->
		<div class="freeAudition ov">
			<span class="auditonTitle"><img src="image/title4.png"/></span>
			<h2 class="auditonTitleCont"><span>精品资料</span> <a href="">更多>></a></h2>
		</div>
		<!--精品资料内容-->
		<ul class="Boutique">
			<li class="ov">
				<!--左边图标-->
				<div class="fLeft BoutleftImg">
					<img class="img" src="image/office1.png"/>
				</div>
				<!--右边内容-->
				<div class="fRight BoutRightTitle">
					<h3><a href="">员工推荐奖励方案员工推荐奖励方案员工推荐奖励方案员工推荐奖励方案</a></h3>
					<p><span>招聘管理|招聘计划</span> <span class="fRight">1260人已下载</span></p>
					<span class="BoutRighTopName">上传时间:</span><span class="BoutRighTopTime">2018-11-15</span><span class="BoutRightXiaBut"><a href=""><img class="img" src="image/btn1.png"/></a></span>
				</div>
			</li>
			<li class="ov">
				<!--左边图标-->
				<div class="fLeft BoutleftImg">
					<img class="img" src="image/office1.png"/>
				</div>
				<!--右边内容-->
				<div class="fRight BoutRightTitle">
					<h3><a href="">员工推荐奖励方案员工推荐奖励方案员工推荐奖励方案员工推荐奖励方案</a></h3>
					<p><span>招聘管理|招聘计划</span> <span class="fRight">1260人已下载</span></p>
					<span class="BoutRighTopName">上传时间:</span><span class="BoutRighTopTime">2018-11-15</span><span class="BoutRightXiaBut"><a href=""><img class="img" src="image/btn1.png"/></a></span>
				</div>
			</li>
			<li class="ov">
				<!--左边图标-->
				<div class="fLeft BoutleftImg">
					<img class="img" src="image/office1.png"/>
				</div>
				<!--右边内容-->
				<div class="fRight BoutRightTitle">
					<h3><a href="">员工推荐奖励方案员工推荐奖励方案员工推荐奖励方案员工推荐奖励方案</a></h3>
					<p><span>招聘管理|招聘计划</span> <span class="fRight">1260人已下载</span></p>
					<span class="BoutRighTopName">上传时间:</span><span class="BoutRighTopTime">2018-11-15</span><span class="BoutRightXiaBut"><a href=""><img class="img" src="image/btn1.png"/></a></span>
				</div>
			</li>
			<li class="ov">
				<!--左边图标-->
				<div class="fLeft BoutleftImg">
					<img class="img" src="image/office1.png"/>
				</div>
				<!--右边内容-->
				<div class="fRight BoutRightTitle">
					<h3><a href="">员工推荐奖励方案员工推荐奖励方案员工推荐奖励方案员工推荐奖励方案</a></h3>
					<p><span>招聘管理|招聘计划</span> <span class="fRight">1260人已下载</span></p>
					<span class="BoutRighTopName">上传时间:</span><span class="BoutRighTopTime">2018-11-15</span><span class="BoutRightXiaBut"><a href=""><img class="img" src="image/btn1.png"/></a></span>
				</div>
			</li>
		</ul>
		<!--图片-->
		<div class="courseA">
			<a href="">
				<img class="img" src="image/banner1.jpg"/>
			</a>
		</div>
		<!--企业内训 title-->
		<div class="freeAudition ov">
			<span class="auditonTitle"><img src="image/title5.png"/></span>
			<h2 class="auditonTitleCont"><span>企业内训</span> <a href="">更多>></a></h2>
		</div>
		<!--企业内训内容-->
		<ul class="CEOinner">
			<li>
				<a href="">
					<img class="img" src="image/photo4.jpg"/>
					<h3>HR实战商学院第16届HRHR实战商学院第16届HR</h3>
				</a>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo5.jpg"/>
					<h3>HR实战商学院第16届HRHR实战商学院第16届HR</h3>
				</a>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo6.jpg"/>
					<h3>HR实战商学院第16届HRHR实战商学院第16届HR</h3>
				</a>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo7.jpg"/>
					<h3>HR实战商学院第16届HRHR实战商学院第16届HR</h3>
				</a>
			</li>
		</ul>
		<!--隔线-->
		<div class='gexian'></div>
		<!--企业咨询 title-->
		<div class="freeAudition ov">
			<span class="auditonTitle"><img src="image/title6.png"/></span>
			<h2 class="auditonTitleCont"><span>企业咨询</span> <a href="##" class="huan">换一批 <i class="mui-icon mui-icon-loop"></i></a></h2>
		</div>
		<!--企业咨询内容-->
		<ul class="CEOAdvisory">
			<li>
				<a href="">
					<img class="img" src="image/photo8.jpg"/>
					<h3 class="h3">讲师：<span>肖聪</span></h3>
				</a>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo9.jpg"/>
					<h3 class="h3">讲师：<span>肖聪</span></h3>
				</a>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo10.jpg"/>
					<h3 class="h3">讲师：<span>肖聪</span></h3>
				</a>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo11.jpg"/>
					<h3 class="h3">讲师：<span>肖聪</span></h3>
				</a>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo12.jpg"/>
					<h3 class="h3">讲师：<span>肖聪</span></h3>
				</a>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo0.jpg"/>
					<h3 class="h3">讲师：<span>肖聪</span></h3>
				</a>
			</li>
		</ul>
		<!--隔线-->
		<div class='gexian'></div>
		<!--畅销图书 title-->
		<div class="freeAudition ov">
			<span class="auditonTitle"><img src="image/title7.png"/></span>
			<h2 class="auditonTitleCont"><span>畅销图书</span> <a href="">更多>></a></h2>
		</div>
		<!--图书内容-->
		<ul class="boomBook">
			<li class="ov">
				<!--左边图书内容-->
				<div class="fLeft">
					<img class="img" src="image/photo13.jpg"/>
				</div>
				<!--右边图书信息-->
				<div class="fRight">
					<h3><a href="">《赢在案例》</a></h3>
					<p>
						资料的试用专业。资料适合一罗宾斯管理学、周三多管理学为参考书目的所有专业资料的试用专业。资料适合一罗宾斯管理学、周三多管理学为参考书目的所有专业
					</p>
					<div class="boomBookMoney">
						<span>￥36.8</span>
						<span>￥26.8</span>
						<span class="fRight"><a href=""><img class="img" src="image/btn2.png"/></a></span>
					</div>
				</div>
			</li>
			<li class="ov">
				<!--左边图书内容-->
				<div class="fLeft">
					<img class="img" src="image/photo13.jpg"/>
				</div>
				<!--右边图书信息-->
				<div class="fRight">
					<h3><a href="">《赢在案例》</a></h3>
					<p>
						资料的试用专业。资料适合一罗宾斯管理学、周三多管理学为参考书目的所有专业资料的试用专业。资料适合一罗宾斯管理学、周三多管理学为参考书目的所有专业
					</p>
					<div class="boomBookMoney">
						<span>￥36.8</span>
						<span>￥26.8</span>
						<span class="fRight"><a href=""><img class="img" src="image/btn2.png"/></a></span>
					</div>
				</div>
			</li>
			<li class="ov">
				<!--左边图书内容-->
				<div class="fLeft">
					<img class="img" src="image/photo13.jpg"/>
				</div>
				<!--右边图书信息-->
				<div class="fRight">
					<h3><a href="">《赢在案例》</a></h3>
					<p>
						资料的试用专业。资料适合一罗宾斯管理学、周三多管理学为参考书目的所有专业资料的试用专业。资料适合一罗宾斯管理学、周三多管理学为参考书目的所有专业
					</p>
					<div class="boomBookMoney">
						<span>￥36.8</span>
						<span>￥26.8</span>
						<span class="fRight"><a href=""><img class="img" src="image/btn2.png"/></a></span>
					</div>
				</div>
			</li>
			<li class="ov">
				<!--左边图书内容-->
				<div class="fLeft">
					<img class="img" src="image/photo13.jpg"/>
				</div>
				<!--右边图书信息-->
				<div class="fRight">
					<h3><a href="">《赢在案例》</a></h3>
					<p>
						资料的试用专业。资料适合一罗宾斯管理学、周三多管理学为参考书目的所有专业资料的试用专业。资料适合一罗宾斯管理学、周三多管理学为参考书目的所有专业
					</p>
					<div class="boomBookMoney">
						<span>￥36.8</span>
						<span>￥26.8</span>
						<span class="fRight"><a href=""><img class="img" src="image/btn2.png"/></a></span>
					</div>
				</div>
			</li>
		</ul>
		<!--隔线-->
		<div class='gexian'></div>
		<!--人才顾问-->
		<div class="freeAudition ov">
			<span class="auditonTitle"><img src="image/title8.png"/></span>
			<h2 class="auditonTitleCont"><span>人才顾问</span> <a href="">更多>></a></h2>
		</div>
		<!--人才顾问内容-->
		<ul class="people">
			<li>
				<a href="">
					<img class="img" src="image/photo14.jpg"/>
					<h3 class="h3">罗女士 <span>4年HR</span></h3>
				</a>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo15.jpg"/>
					<h3 class="h3">罗女士 <span>4年HR</span></h3>
				</a>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo16.jpg"/>
					<h3 class="h3">罗女士 <span>4年HR</span></h3>
				</a>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo17.jpg"/>
					<h3 class="h3">罗女士 <span>4年HR</span></h3>
				</a>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo18.jpg"/>
					<h3 class="h3">罗女士 <span>4年HR</span></h3>
				</a>
			</li>
			<li>
				<a href="">
					<img class="img" src="image/photo19.jpg"/>
					<h3 class="h3">罗女士 <span>4年HR</span></h3>
				</a>
			</li>
		</ul>
	</div>
	<!-- 点缀 -->
	<div class="diandui">
		<p>Copyright © 2017 All Rights Reserved 版权所有 <br> 
			河南励客教育科技有限公司 豫ICP备17004519号-1
		</p>
	</div>
	<div class='dangban'></div>
	<nav class="mui-bar mui-bar-tab fottNav">
	    <a class="mui-tab-item mui-active" href="##">
	        <span class="tubiao "><img class="imgW" src="image/choose1.png"/></span>
	        <span class="mui-tab-label">发现</span>
	    </a>
	    <a class="mui-tab-item" href="##">
	        <span class="tubiao"><img src="image/ficon2.png"/></span>
	        <span class="mui-tab-label">文章</span>
	    </a>
	    <a class="mui-tab-item" href="##">
	        <span class="tubiao"><img src="image/ficon3.png"/></span>
	        <span class="mui-tab-label">今日学习</span>
	    </a>
	    <a class="mui-tab-item" href="##">
	        <span class="tubiao"><img src="image/ficon4.png"/></span>
	        <span class="mui-tab-label">资料</span>
	    </a>
	    <a class="mui-tab-item" href="##">
	       <span class="tubiao"><img src="image/ficon5.png"/></span>
	        <span class="mui-tab-label">我的</span>
	    </a>
	</nav>
	
	<script type="text/javascript">
		// <!--图片轮播-->
		var gallery = mui('.mui-slider');
		gallery.slider({
		  interval:1000//自动轮播周期，若为0则不自动播放，默认为0；
		});		
		 $(document).ready(function () {
		 	var li_W = $('.navHuaChild').width();
//		 	var li_Len = $('.navHuaChild li').length;
//		 	console.log(li_W+"--"+li_Len+'---'+li_W*li_Len)
		 	$('.navHuaChild').css('width', li_W+100);
		 	var lis_W = $('.auditionVideo li').width();
		 	var lis_Len = $('.auditionVideo li').length;
		 	$('.auditionVideo').css('width',lis_W*lis_Len+100);
			// 给轮播宽度设置
			var lunH = $('.content li').height();
			$('.content').css('height',lunH);
			// 轮播设置
			var index_start = 0;
			// 结束的位置
			var index_end = $('.content li').length;
			var time = setInterval(autonChang,1000);
			function autonChang(){
				index_start++;
				if(index_start == index_end){
					index_start = 0;
				}
				$('.content li').eq(index_start).addClass('zindex').siblings().removeClass('zindex');
				$('.indicator li').eq(index_start).addClass('active').siblings().removeClass('active');
			}
	
		 })
		
	</script>
</body>
</html>
